<template>
	<view class="content">
		<view style="height: 366rpx;background-color: #37BCC3;">
			<view class="wid80 mar coFFF" >
				<view style="height: 44rpx;"></view>
				<button v-if="!userInfo" @click="getUserInfo" class="dis disAl coFFF" style="background-color: #37BCC3;">
					<image :src="url+'/addon/qianyu_petrol/wxapp/image/header.png'" class="borRad50"
						style="width: 110rpx;height: 110rpx;"></image>
					<view class="fowe600 foSi45 dis disAl wid80">点击登录</view>
				</button>
				<view v-if="userInfo" class="dis disAl disJuB">
					<view class="dis disJuC wid20" style="height: 110rpx;">
						<image v-if="userInfo.avatar" :src="url+userInfo.avatar" class="borRad50 hei100"
							style="width: 110rpx;"></image>
						<image v-if="!userInfo.avatar" :src="url+'/addon/qianyu_petrol/wxapp/image/header.png'"
							class="borRad50 hei100" style="width: 110rpx;"></image>
					</view>
					<view class="dis disAl disJuB" style="width: 75%;">
						<view class="wid90">
							<view class="fowe800 foSi45 overflowHidden">{{userInfo.nickname?userInfo.nickname:'点击登录'}}</view>
							<view class="mar-top20 foSi25 fowe600">{{userInfo.mobile}}</view>
						</view>
						<view class="">
							<image src="../../static/shezhi1.png" style="width: 37rpx;height: 37rpx;" @click="tiaozhuan('/pages/wode/install')"></image>
							<image src="../../static/qrcode.png" style="width: 37rpx;height: 37rpx; margin-top: 20rpx;" @click="is_xss(true)"></image>
						</view>
					</view>
				</view>
				<view class="dis disJuB fowe600" style="margin-top: 50rpx;">
					<view class="textCen" @click="tiaozhuan('/pages/index/activity')">
						<view class="foSi30">￥{{userInfo.money?userInfo.money:0}}</view>
						<view class="foSi25 mar-top10">余额</view>
					</view>
					<view class="textCen" @click="tiaozhuan('/pages/wode/getACoupon')">
						<view class="foSi30">{{userInfo.coupon_log_count?userInfo.coupon_log_count:0}}</view>
						<view class="foSi25 mar-top10">优惠券</view>
					</view>
					<view class="textCen" @click="tiaozhuan('/pages/wode/collect')">
						<view class="foSi30">{{userInfo.collect_count?userInfo.collect_count:0}}</view>
						<view class="foSi25 mar-top10">收藏</view>
					</view>
				</view>
			</view>
		</view>
		<view class="wid85 mar borRad20" style="margin-top: -40rpx;background-color: #000000;">
			<view class="hei80 dis disAl disJuB wid90 mar">
				<view class="dis disAl">
					<image src="../../static/huiyuan1.png" style="width: 30rpx;height: 26rpx;"></image>
					<view class="mar-left20 foSi25 coFFF">普通会员</view>
				</view>
				<view class="borRad40 dis disAl disJuC foSi25 fowe800" @click="tiaozhuan('/pages/index/activity')"
					style="background-color: #FDBA54;width: 126rpx;height: 50rpx;">去充值</view>
			</view>
		</view>
		<view v-if="address" class="wid85 mar bacFFF borRad20 mar-top30" @click="tiaozhuan('/pages/wode/address?address_type=1')"
			style="box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0,0,0,0.2);">
			<view class="wid90 mar dis disAl disJuB hei80">
				<view class="fowe800 foSi30">当前代取点</view>
				<view class="dis disAl mar-left30 foSi20 fowe600" style="color: #737373;">
					<view>切换</view>
					<uni-icons class="dis" type="right" size="20rpx" color="#737373"></uni-icons>
				</view>
			</view>
			<view class="wid100" style="height: 0rpx;border-bottom: 1rpx dashed #E1DFDF;"></view>
			<view class="wid90 mar mar-top20">
				<view class="fowe800 foSi30" style="color: #37BCC3;">{{address.name}}</view>
				<view class="mar-top15 foSi20" style="color: #686868;">{{address.address+address.content}}</view>
				<view class="dis disAl mar-top20">
					<image src="../../static/duanhua1.png" style="width: 27rpx;height: 27rpx;"></image>
					<view class="mar-left10 foSi20" style="color: #686868;">电话：{{address.phone}}</view>
				</view>
			</view>
			<view class="hei20"></view>
		</view>
		<view class="wid85 mar bacFFF borRad20 mar-top30" style="box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0,0,0,0.2);">
			<view class="wid90 mar dis disAl disJuB hei80">
				<view class="fowe800 foSi30">洗护订单</view>
				<view class="dis disAl mar-left30 foSi20 fowe600" style="color: #737373;" @click="tiaozhuan('/pages/order/order?xuan=0')">
					<view>查看全部订单</view>
					<uni-icons class="dis" type="right" size="20rpx" color="#737373"></uni-icons>
				</view>
			</view>
			<view class="wid100" style="height: 1rpx;border-bottom: 1rpx dashed #E1DFDF;"></view>
			<view class="dis disAl disJuB wid90 mar" style="height: 150rpx;">
				<view class="textCen" @click="tiaozhuan('/pages/order/order?xuan=1')">
					<view class="mar" style="width: 47rpx;height: 51rpx;">
						<image src="../../static/daizhifu2.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">待支付</view>
				</view>
				<view class="textCen" @click="tiaozhuan('/pages/order/order?xuan=2')">
					<view class="mar" style="width: 62rpx;height: 51rpx;">
						<image src="../../static/shiyongjilu1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">待收衣</view>
				</view>
				<view class="textCen" @click="tiaozhuan('/pages/order/order?xuan=3')">
					<view class="mar" style="width: 44rpx;height: 51rpx;">
						<image src="../../static/qingxi1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">清洗中</view>
				</view>
				<view class="textCen" @click="tiaozhuan('/pages/order/order?xuan=4')">
					<view class="mar" style="width: 57rpx;height: 51rpx;">
						<image src="../../static/peisong1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">配送中</view>
				</view>
				<view class="textCen" @click="tiaozhuan('/pages/order/order?xuan=5')">
					<view class="mar" style="width: 41rpx;height: 51rpx;">
						<image src="../../static/wancheng1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">已完成</view>
				</view>
			</view>
		</view>
		<view class="wid85 mar bacFFF borRad20 mar-top30" style="box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0,0,0,0.2);">
			<view class="wid90 mar dis disAl disJuB hei80">
				<view class="fowe800 foSi30">商城订单</view>
				<view class="dis disAl mar-left30 foSi20 fowe600" style="color: #737373;" @click="tiaozhuan('/pages/order/order2?xuan=0')">
					<view>查看全部订单</view>
					<uni-icons class="dis" type="right" size="20rpx" color="#737373"></uni-icons>
				</view>
			</view>
			<view class="wid100" style="height: 1rpx;border-bottom: 1rpx dashed #E1DFDF;"></view>
			<view class="dis disAl disJuB wid90 mar" style="height: 150rpx;">
				<view class="textCen" @click="tiaozhuan('/pages/order/order2?xuan=1')">
					<view class="mar" style="width: 49rpx;height: 51rpx;">
						<image src="../../static/daizhifu1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">待付款</view>
				</view>
				<view class="textCen" @click="tiaozhuan('/pages/order/order2?xuan=2')">
					<view class="mar" style="width: 51rpx;height: 51rpx;">
						<image src="../../static/daifahuo1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">待发货</view>
				</view>
				<view class="textCen" @click="tiaozhuan('/pages/order/order2?xuan=3')">
					<view class="mar" style="width: 62rpx;height: 51rpx;">
						<image src="../../static/daishouhuo1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">待收货</view>
				</view>
				<view class="textCen" @click="tiaozhuan('/pages/order/order2?xuan=4')">
					<view class="mar" style="width: 55rpx;height: 51rpx;">
						<image src="../../static/yishouhuo1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">已完成</view>
				</view>
				<view class="textCen" @click="tiaozhuan('/pages/order/order2?xuan=5')">
					<view class="mar" style="width: 50rpx;height: 51rpx;">
						<image src="../../static/quxiao1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">已取消</view>
				</view>
			</view>
		</view>
		<view class="wid85 mar bacFFF borRad20 mar-top30" style="box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0,0,0,0.2);">
			<view class="wid90 mar dis disAl fowe800 foSi30 hei80">更多功能</view>
			<view class="wid100" style="height: 1rpx;border-bottom: 1rpx dashed #E1DFDF;"></view>
			<view class="dis disAl disJuB wid90 mar mar-top30">
				<view class="textCen wid25" @click="tiaozhuan(identity == '0'?'/pages/distribution/applicant':'/pages/distribution/distribution')">
					<view class="mar" style="width: 56rpx;height: 51rpx;">
						<image src="../../static/fenxiaozhongxin1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">分销中心</view>
				</view>
				<view class="textCen wid25" @click="tiaozhuan('/pages/wode/service')">
					<view class="mar" style="width: 48rpx;height: 51rpx;">
						<image src="../../static/kefu1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">客服中心</view>
				</view>
				<view class="textCen wid25" @click="tiaozhuan('/pages/wode/address?address_type=0')">
					<view class="mar" style="width: 45rpx;height: 51rpx;">
						<image src="../../static/shouhuo1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">地址管理</view>
				</view>
				<view class="textCen wid25" @click="tiaozhuan('/pages/wode/shop')">
					<view class="mar" style="width: 57rpx;height: 51rpx;">
						<image src="../../static/mendian1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">门店信息</view>
				</view>
			</view>
			<view class="dis disAl disJuB wid90 mar mar-top30">
				<view class="textCen wid25" @click="tiaozhuan('/pages/common/richtext?title=用户协议&type=0')">
					<view class="mar" style="width: 48rpx;height: 51rpx;">
						<image src="../../static/yonghuxieyi.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">用户协议</view>
				</view>
				<view class="textCen wid25" @click="tiaozhuan('/pages/common/richtext?title=隐私协议&type=1')">
					<view class="mar" style="width: 48rpx;height: 51rpx;">
						<image src="../../static/yinsixieyi.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">隐私协议</view>
				</view>
				<view class="textCen wid25" @click="tiaozhuan('/pages/shop/shop')">
					<view class="mar" style="width: 48rpx;height: 51rpx;">
						<image src="../../static/yuangongrukeo1.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">员工入口</view>
				</view>
				<view class="textCen wid25" @click="tiaozhuan('/pages/wode/install')">
					<view class="mar" style="width: 51rpx;height: 51rpx;">
						<image src="../../static/shezhi2.png" class="wh100"></image>
					</view>
					<view class="foSi25 fowe800 mar-top20">设置</view>
				</view>
			</view>
			<view style="height: 30rpx;"></view>
		</view>
		<view style="height: 30rpx;"></view>
		<uni-popup ref="popup" background-color="#fff" type="bottom" border-radius="10px 10px 0 0">
			<view class="wid90 mar">
				<view class="hei20"></view>
				<view class="dis disAl">
					<image v-if="!avatar" :src="url+'/addon/qianyu_petrol/wxapp/image/header.png'" class="borRad50"
						style="width: 50rpx;height: 50rpx;"></image>
					<view class="mar-left20 fowe600 foSi30">净之源干洗店 申请</view>
				</view>
				<view class="mar-top40 fowe600 foSi30">获取您的头像、昵称、手机号</view>
				<view class="wid100 dis disAl mar-top30" style="height: 100rpx;">
					<view class="fowe600 foSi25" style="width: 20%;">头像</view>
					<button hover-class="none" type="balanced" class="dis disAl disJuB bacFFF wid80"
						open-type="chooseAvatar" @chooseavatar="onChooseavatar">
						<image v-if="avatar" :src="url+avatar" class="borRad50" style="width: 80rpx;height: 80rpx;">
						</image>
						<image v-if="!avatar" :src="url+'/addon/qianyu_petrol/wxapp/image/header.png'" class="borRad50"
							style="width: 80rpx;height: 80rpx;"></image>
						<uni-icons type="right" size="30rpx"></uni-icons>
					</button>
				</view>
				<view class="xia"></view>
				<view class="wid100 dis disAl" style="height: 100rpx;">
					<view class="fowe600 foSi25" style="width: 20%;">昵称</view>
					<input type="nickname" class="wid80 foSi25" v-model="name" @change="namChange" placeholder="点击填写" />
				</view>
				<view class="xia"></view>
				<view class="wid100 dis disAl" style="height: 100rpx;">
					<view class="fowe600 foSi25" style="width: 20%;">手机号</view>
					<button v-if="!mobile" @getphonenumber="getWechatMobile" open-type="getPhoneNumber"
						class="hei80 dis disAl bacFFF foSi25 wid80">点击授权</button>
					<view v-if="mobile" class="hei80 dis disAl bacFFF foSi25 wid80">{{mobile}}</view>
				</view>
				<view class="xia"></view>
				<view class="hei80 mar-top40 dis disAl disJuC foSi30 borRad10" @click="denglu()"
					style="background-color: #E5EEFF;color: #035DFF;">允许</view>
				<view class="hei80 mar-top20 dis disAl disJuC foSi30" @click="close()">拒绝</view>
			</view>
		</uni-popup>
		<view class="tc" v-if="is_xs==true" @click="is_xss(false)">
			<view class="tc2">
				<image :src="url+'/addon/qianyu_petrol/wxapp/image/gh_453e07fd1f91_344.jpg'" show-menu-by-longpress mode="widthFix" style="width: 200px;"></image>
				长按保存小程序码
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				url: this.global.url,
				userInfo: '',
				avatar: '',
				name: '',
				mobile: '',
				address: '',
				is_xs: false,
				identity:0
			}
		},
		onLoad() {},
		onShow() {
			var that = this
			if (!uni.getStorageSync('token')) {
				that.userInfo = ''
			} else {
				that.getUserInfo()
				that.getAddressDefault()
			}
			that.identity = uni.getStorageSync('userinfo').identity;
		},
		// 自定义此页面的转发给好友(已经有全局的分享方法，此处会覆盖全局)
		onShareAppMessage(res) {
			var that = this;
			var userinfo = uni.getStorageSync('userinfo')
			var imageUrl = this.url + '/addon/qianyu_petrol/wxapp/image/header.png'

			if (userinfo.avatar) {
				imageUrl = this.url + userinfo.avatar
			}
			that.dingyue()
			return {
				title: '惠易油',
				path: '/pages/index/index?parent_id=' + userinfo.id,
				imageUrl: imageUrl
			}
		},
		methods: {
			is_xss(a){
				var that = this;
				that.is_xs = a
			},
			getAddressDefault() {
				var that = this;
				uni.request({
					url: that.global.url + '/api/qianyu_petrol/gasstation_address_default',
					method: "POST",
					header: {
						'site-id': that.global.site_id,
						"token": uni.getStorageSync('token')
					},
					data: {},
					success(res) {
						let result = res.data
						console.log(result)
						if (result.code == 1) {
							that.address =	result.data
						}
					}
				})
			},
			getUserInfo() {
				var that = this;
				var nickname = uni.getStorageSync('userinfo').nickname
				uni.request({
					url: that.global.url + '/api/qianyu_petrol/gasstation_userlogin',
					method: "GET",
					header: {
						'site-id': that.global.site_id //自定义请求头信息
					},
					data: {
						openid: uni.getStorageSync('openid')
					},
					success(res) {
						let result = res.data
						console.log(result)
						if (result.code == 1) {
							uni.setStorageSync('userinfo', result.data);
							uni.setStorageSync('token', result.data.token);
							that.userInfo = result.data
						} else {
							that.$refs.popup.open()
						}
					}
				})
			},
			dingyue() {
				var that = this
				// 要检查的订阅id
				let id = uni.getStorageSync('tzId').invite_success_template
				let id1 = uni.getStorageSync('tzId').reward_received_template
				// 这里是获取下发权限地方，根据官方文档，可以根据  wx.getSetting() 的 withSubscriptions   这个参数获取用户是否打开订阅消息总开关。后面我们需要获取用户是否同意总是同意消息推送。所以这里要给它设置为true 。
				wx.getSetting({
					withSubscriptions: true, //  这里设置为true,下面才会返回mainSwitch
					success: function(res) {
						// 调起授权界面弹窗
						// if (res.subscriptionsSetting.mainSwitch) { // 用户打开了订阅消息总开关
						// 	if (res.subscriptionsSetting.itemSettings == null) {
						// 当用户没有点击 ’总是保持以上选择，不再询问‘  按钮。那每次执到这都会拉起授权弹窗
						wx.showModal({
							title: '提示',
							content: '请授权开通服务通知',
							showCancel: true,
							success: function(ress) {
								if (ress.confirm) {
									wx.requestSubscribeMessage({ // 调起消息订阅界面
										tmplIds: [id, id1],
										success(res) {
											console.log('订阅消息 成功 ');
											console.log(res);
										},
										fail(er) {
											console.log("订阅消息 失败 ");
											console.log(er);
										}
									})
								}
							}
						})
						// 	}
						// }
					},
					fail: function(error) {
						console.log(error);
					},
				})
			},
			//选择头像
			onChooseavatar(e) {
				var that = this
				console.log(e.detail);
				that.shangchuan(e.detail.avatarUrl)
			},
			namChange(res) {
				this.name = res.detail.value
			},
			close() {
				this.$refs.popup.close()
			},
			denglu() {
				var that = this;
				uni.request({
					url: that.global.url + '/api/qianyu_petrol/gasstation_userlogin',
					method: 'GET',
					header: {
						'site-id': that.global.site_id,
					},
					data: {
						'avatar': that.avatar,
						'nickname': that.name ? that.name : '默认用户',
						'mobile': that.mobile,
						'openid': uni.getStorageSync('openid'),
						'parent_id': uni.getStorageSync('parent_id')
					},
					complete: function() {
						uni.hideLoading();
					},
					success: function(result) {
						var apiResult = result.data;
						if (apiResult.code == 1) {
							uni.setStorageSync('userinfo', apiResult.data);
							uni.setStorageSync('token', apiResult.data.token);
							that.userInfo = apiResult.data
						} else {
							uni.showToast({
								title: apiResult.msg,
								icon: 'error',
								duration: 2000
							})
						}
						that.$refs.popup.close()
					}
				});
			},
			shangchuan(tempFilePaths) {
				var that = this
				uni.uploadFile({
					url: that.global.url + '/api/qianyu_petrol/gasstation_common_image',
					header: {
						'site-id': that.global.site_id,
						"token": uni.getStorageSync('token'),
					}, //请求token	
					filePath: tempFilePaths,
					name: 'file',
					success: (res) => {
						var apiresult = JSON.parse(res.data)
						if (apiresult.code == 1) {
							console.log(apiresult.data.url);
							that.avatar = apiresult.data.url;
						} else {
							uni.showToast({
								title: apiresult.msg,
								icon: 'error',
								duration: 2000
							})
						}
					},
					fail() {
						uni.showToast({
							title: "网络连接失败",
							icon: 'error',
							duration: 2000
						})
					}
				});
			},
			getWechatMobile(e) {
				var that = this;
				uni.request({
					url: that.global.url + '/api/qianyu_petrol/gasstation_getphone',
					method: 'GET',
					header: {
						'site-id': that.global.site_id,
					},
					data: {
						'code': e.detail.code
					},
					complete: function() {
						uni.hideLoading();
					},
					success: function(result) {
						var apiResult = result.data;
						if (apiResult.code == 1) {
							that.mobile = apiResult.data
						}
					}
				});
			},
			tiaozhuan(url) {
				if (uni.getStorageSync('yuan_userinfo') && url == '/pages/shop/shop') {
					url = '/pages/shop/workbench'
				}
				if (!uni.getStorageSync('userinfo')) {
					this.getUserInfo()
				} else {
					uni.navigateTo({
						url: url
					})
				}
			},
			tishi(){
				uni.showToast({
					title: '正在开发！',
					icon: 'none',
				})
			}
		}
	}
</script>

<style>
	.content {
		min-height: 100vh;
	}

	.xia {
		height: 1rpx;
		background-color: #D2D2D2;
	}
	.tc{
		width: 100%;
		height: 100vh;
		position: absolute;
		top: 0;
		left:0;
		background: rgba(0, 0, 0, 0.5);
	}
	.tc2{
		width: 200px;
		position: absolute;
		top: 50%;
		left:50%;
		transform: translate(-50%,-50%);
		color: #fff;
		text-align: center;
	}
</style>